<!DOCTYPE html>
<#assign ctx=springMacroRequestContext.contextPath />
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>天天生鲜-商品列表</title>
    <link rel="stylesheet" type="text/css" href="css/reset.css">
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <script src="js/jquery-1.12.4.min.js"></script>
</head>

<body>
<div class="header_con">
    <div class="header">
        <div class="welcome fl">欢迎来到天天生鲜!</div>
        <div class="fr">
            <div class="login_info fl">
                欢迎您：<em>张 山</em>
            </div>
            <div class="login_btn fl">
                <a href="login.html">登录</a>
                <span>|</span>
                <a href="register.html">注册</a>
            </div>
            <div class="user_link fl">
                <span>|</span>
                <a href="javascript:gotoinfo()">用户中心</a>
                <span>|</span>
                <a href="javascript:gotocart()">我的购物车</a>
                <span>|</span>
                <a href="javascript:UserOrder()">我的订单</a>
            </div>
        </div>
    </div>
</div>

<script>
    /**
     * 全部商品
     */

    $(document).ready(function () {
        getAllGoods(1, 5);
    })

    function getAllGoods(page, size) {
        $.ajax({
            url: "getAllGoods",
            data: {page: page, size: size},
            dataType: "json",
            type: "GET",
            success: function (msg) {
                var str = '<ul class="goods_type_list clearfix" >';
                for (var i = 0; i < msg.data.length; i++) {
                    str = str + '<li>' +
                        '<a href="javascript:gotodetail('+msg.data[i].goods_id+')"><img src="images/'+msg.data[i].goods_picture+'"></a>' +
                        '<h4><a href="">' + msg.data[i].goods_name + '</a></h4>' +
                        '<div class="operate">' +
                        '<span class="prize">￥' + msg.data[i].goods_price + '</span>' +
                        '<span class="unit">' + msg.data[i].goods_unit + '</span>' +
                        '<a href="#" class="add_goods" title="加入购物车"></a>' +
                        '</div>' +
                        '</li>';
                }
                str = str + '</ul>';
                $("#goods").html(str);
                var maxPage=msg.maxPage;
                var size=msg.size;
                str2 ='<a href="javascript:getAllGoods(1,' + size
                    + ',)">首页</a>&nbsp;&nbsp;&nbsp;'+
                    '<a href="javascript:getAllGoods(' + (page - 1) + ', '+size+')">' +
                    '上一页</a>' +
                    ' <span  id="mya"></span >' +
                    '<a href="javascript:getAllGoods(' + (page + 1) + ', '+size+')">下一页</a>'+
                    '<a href="javascript:getAllGoods('+maxPage+',' + size
                    + ')">尾页</a>';
                $("#index").html(str2);
                var myindex = msg.maxPage;
                if (myindex != '') {
                    myindex = parseInt(myindex);
                    var str3 = '';
                    for (var i = 0; i < myindex; i++) {
                        if ((i + 1) == page) {
                            str3 = str3 + '<a href="javascript:getAllGoods(' + (i + 1) + ', ' + size + ')" class="active">' + (i + 1) + '</a>';
                        } else {
                            str3 = str3 + '<a href="javascript:getAllGoods(' + (i + 1) + ', ' + size + ')" >' + (i + 1) + '</a>';
                        }
                    }
                    $("#mya").html(str3);

                }


            }
        })

    }
</script>
<script>
    /**
     * 商品按时间顺序
     */
    $(document).ready(function () {
        getGoodsByTime(0, 2);
    })

    function getGoodsByTime(page, size) {
        $.ajax({
            url: "getGoodsByTime",
            data: {page: page, size: size},
            dataType: "json",
            type: "GET",
            success: function (msg) {

                var str5 = '<ul>';
                for (var i = 0; i < msg.data.length; i++) {
                    str5 = str5 + ' <li>' +
                        '<a href="javascript:gotodetail('+msg.data[i].goods_id+')"><img src="images/'+msg.data[i].goods_picture+'"></a>' +
                        '<h4><a href="#">' + msg.data[i].goods_name + '</a></h4>' +
                        '<div class="prize">￥' + msg.data[i].goods_price + '</div>' +
                        '</li>';
                }
                str5 = str5 + "</ul>"
                $("#mygoodsbytime").html(str5);


            }
        })

    }
</script>
<script>
    /**
     * 跳转详情页
     */
    function gotodetail(id) {
        location.href = "queryGoodsByGoodsId?id=" + id;
    }
    function gotocart() {
        location.href="shopcar";
    }
    function  gotoinfo() {
        location.href="user_center_info"
    }
    function UserOrder() {
        location.href = "user_center_order" ;
    }
</script>
<script>
    /**
     * 用关键字查询商品
     * @param page
     * @param size
     * @param key
     */
    function getAllGoodsByKey(page, size, key) {
        $.ajax({
            url: "getAllGoodsByKey",
            data: {page: page, size: size, key: key},
            dataType: "json",
            type: "GET",
            success: function (msg) {
                var str = '<ul class="goods_type_list clearfix" >';
                for (var i = 0; i < msg.data.length; i++) {
                    str = str + '<li>' +
                        '<a href="javascript:gotodetail('+msg.data[i].goods_id+')"><img src="images/'+msg.data[i].goods_picture+'"></a>' +
                        '<h4><a href="">' + msg.data[i].goods_name + '</a></h4>' +
                        '<div class="operate">' +
                        '<span class="prize">￥' + msg.data[i].goods_price + '</span>' +
                        '<span class="unit">' + msg.data[i].goods_unit + '</span>' +
                        '<a href="#" class="add_goods" title="加入购物车"></a>' +
                        '</div>' +
                        '</li>';
                }
                str = str + '</ul>';
                $("#goods").html(str);


            }
        })

    }
</script>
<script>
    function myrearch() {
        var key = $("#search").val();
        getAllGoodsByKey(0, 10, key);
    }
</script>
<script>
function myrearch2() {
 var key="新鲜水果";
    getAllGoodsByKey(0, 10, key);
}
</script>
<script>
    function myrearch3() {
        var key="海鲜水产";
        getAllGoodsByKey(0, 10, key);
    }
</script>
<script>
    function myrearch4() {
        var key="猪牛羊肉";
        getAllGoodsByKey(0, 10, key);
    }
</script>
<script>
    function myrearch5() {
        var key="禽类蛋品";
        getAllGoodsByKey(0, 10, key);
    }
</script>
<script>
    function myrearch6() {
        var key="新鲜蔬菜";
        getAllGoodsByKey(0, 10, key);
    }
</script>
<script>
    function myrearch7() {
        var key="速冻食品";
        getAllGoodsByKey(0, 10, key);
    }
</script>
<div class="search_bar clearfix">
    <a href="index.html" class="logo fl"><img src="images/logo.png"></a>
    <div class="search_con fl">
        <input type="text" class="input_text fl" id="search" placeholder="搜索商品">
        <button class="input_btn fr" onclick="myrearch()" >搜索</button>
    </div>
    <div class="guest_cart fr">
        <a href="#" class="cart_name fl">我的购物车</a>
        <div class="goods_count fl">1</div>
    </div>
</div>
<script>
    function gotoindex() {
        location.href="main";
        
    }
</script>
<div class="navbar_con">
    <div class="navbar clearfix">
        <div class="subnav_con fl">
            <h1>全部商品分类</h1>
            <span></span>
            <ul class="subnav">
                <li><a href="javaScript:myrearch2()" class="fruit" id="fruit">新鲜水果</a></li>
                <li><a href="javaScript:myrearch3()" class="seafood" id="seafood">海鲜水产</a></li>
                <li><a href="javaScript:myrearch4()" class="meet">猪牛羊肉</a></li>
                <li><a href="javaScript:myrearch5()" class="egg">禽类蛋品</a></li>
                <li><a href="javaScript:myrearch6()" class="vegetables">新鲜蔬菜</a></li>
                <li><a href="javaScript:myrearch7()" class="ice">速冻食品</a></li>
            </ul>
        </div>
        <ul class="navlist fl">
            <li><a href="javascript:gotoindex()">首页</a></li>
            <li class="interval">|</li>
            <li><a href="">手机生鲜</a></li>
            <li class="interval">|</li>
            <li><a href="">抽奖</a></li>
        </ul>
    </div>
</div>

<div class="breadcrumb">
    <a href="#">全部分类</a>
    <span>></span>
    <a href="#">新鲜水果</a>
</div>

<div class="main_wrap clearfix">
    <div class="l_wrap fl clearfix">
        <div class="new_goods" id="mygoodsbytime">
            <h3>新品推荐</h3>
        </div>
    </div>

    <div class="r_wrap fr clearfix">
        <div class="sort_bar">
            <a href="#" class="active">默认</a>
            <a href="#">价格</a>
            <a href="#">人气</a>
        </div>
        <div id="goods"></div>

        <div class="pagenation" id="index">
            <#--<a href="#">-->
            <#--<上一页-->
            <#--</a>-->
            <#--<a href="#" class="active">1</a>-->
            <#--<a href="#">2</a>-->
            <#--<a href="#">3</a>-->
            <#--<a href="#">4</a>-->
            <#--<a href="#">5</a>-->
            <#--<a href="#">下一页></a>-->
        </div>
    </div>
</div>

<div class="footer">
    <div class="foot_link">
        <a href="#">关于我们</a>
        <span>|</span>
        <a href="#">联系我们</a>
        <span>|</span>
        <a href="#">招聘人才</a>
        <span>|</span>
        <a href="#">友情链接</a>
    </div>
    <p>CopyRight © 2016 北京天天生鲜信息技术有限公司 All Rights Reserved</p>
    <p>电话：010-****888 京ICP备*******8号</p>
</div>

</body>
</html>